//################################
// 版权所有：鸽子游戏俱乐部
// 系统名称：鸽子游戏俱乐部-移动版
// 文件名称：backpage.js
// 创建时间：2017年05月24日
// 创建人员：Lemo
// 功能说明：app第一页：还回
//################################

'use strict';

import React, {Component} from 'react';
import {
    StyleSheet,
    View,
    Image,
    Text,
    TextInput,
    ScrollView,
    Dimensions,
    TouchableOpacity,
    InteractionManager,
} from 'react-native';

import ModalDropdown from 'react-native-modal-dropdown';
import Button from '../../components/button';
import Colors from '../../common/colors';
import Images from '../../images';
import UIConstants from '../../common/uiconstants';
import Routes from '../../common/routes';
import FontSizes from '../../common/fontSizes';

import BackPageContainer from '../containers/backPageContainer';

const WINDOW_WIDTH = Dimensions.get('window').width;
const WINDOW_HEIGHT = Dimensions.get('window').height;

class BackPage extends Component {
    constructor(props) {
        super(props);

        this.onChangeExpressnum = this.onChangeExpressnumFunc.bind(this);
        this.onPressSubmit = this.onPressSubmitFunc.bind(this);
        this.showAddress = this.showAddressFunc.bind(this);

        this.state = {
            expressname: null,
            expressnum: null,
            showAddress: false,
        };
    }

    componentDidMount() {
        
    }

    onChangeExpressnumFunc(etxt){
        this.setState({expressnum: etxt});
    }
    
    onPressSubmitFunc(){
        alert('提交啦~');
    }

    showAddressFunc() {
        this.setState({showAddress: true});
        setTimeout(() => {
            this.setState({showAddress: false});
        }, 10000);
    }

    render() {
        return (
            <View style={styles.container}>
                <View>
                    <View style={styles.formrow}>
                        <Text>{'会员号　'}</Text>
                        <TextInput 
                            style={[styles.textinput,{backgroundColor:'#EFEFEF'}]}
                            placeholder={'8008556'}
                            underlineColorAndroid={'transparent'}
                            editable={false}/>
                    </View>
                    <View style={styles.formrow}>
                        <Text>{'选择游戏'}</Text>
                        <View style={{marginLeft:10}}>
                            <Text style={{fontSize:12}}>{'没有需要归还的游戏'}</Text>
                        </View>
                    </View>
                    <View style={styles.formrow}>
                        <Text>{'快递公司'}</Text>
                        <ModalDropdown 
                            style={styles.textinput}
                            dropdownStyle={styles.dropdownOptions}
                            defaultValue={'请选择快递公司'}
                            options={['顺丰快递','韵达快递','中通快递','圆通快递','申通快递','百世汇通','天天快递','EMS','其它']}
                            />
                    </View>
                    <View style={styles.formrow}>
                        <Text>{'快递单号'}</Text>
                        <TextInput 
                            style={styles.textinput}
                            placeholder={'输入快递单号'}
                            value = {this.state.expressnum}
                            maxLength={20}
                            returnKeyType={'done'}
                            underlineColorAndroid={'transparent'}
                            autoCapitalize={'none'}
                            autoCorrect={false}
                            onChangeText={this.onChangeExpressnum}/>
                    </View>
                    <View style={[styles.formrow,{height:40}]}>
                        <Button style={styles.button} onPress={this.onPressSubmit} text={'提交'} />
                    </View>
                </View>

                <View style={styles.tips}><Text style={{fontSize:13}}>{'温馨提示：亲，您寄回来的时候注意包装呢！之前有会员寄过来坏了，已经进行了赔偿呢。还希望亲用我们发给您的包装包装好，盒子里面如果是光盘，最好垫上泡泡纸或者面纸以防光盘在运输过程中脱落呢。'}</Text></View>
                
                <View style={styles.tips}>
                    {this.state.showAddress ?
                    <Text style={{fontSize:13}}>
                        {'上海市浦东新区凌河路354弄12号，收件人：鸽子的美好世界，联系电话：17721398125。(注意：周日休息，不发快递，每天17点后收到的快递第二天拆包检查。检查无误后，两个工作日内发出，如果比较急，可向客服反应登记)'}
                    </Text>
                    :
                    <TouchableOpacity onPress={this.showAddress} style={{padding:5,alignItems:'center',justifyContent:'center'}}>
                        <Text style={{fontSize:13,color:'red'}}>{'点击查看收货地址'}</Text>
                    </TouchableOpacity>
                    }
                </View>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: Colors.appBackground,
    },

    formrow: {
        flexDirection: 'row',
        alignItems: 'center',
        margin: 15,
        marginTop: 5,
        marginBottom: 5,
    },
    textinput: {
        flex: 1,
        borderWidth: 1,
        borderColor: '#999999',
        borderRadius: 5,
        height: 34,
        fontSize: 12,
        marginLeft: 10,
        padding: 2,
        paddingLeft: 10,
        justifyContent:'center',
    },
    dropdownOptions: {
        flex:1,
        marginTop: -15,
        marginLeft:-10,
        borderColor: '#ccc',
        borderWidth: 1,
        height: 150,
        width: WINDOW_WIDTH - 110,
    },
    button: {
        flex: 1,
        marginLeft: 15,
        marginRight: 15,
        width: WINDOW_WIDTH - 30,
    },
    tips: {
        backgroundColor:'#EFEFEF',
        margin:15,
        marginTop:0,
        borderRadius:6,
        padding:10
    }
});

export default BackPage;